
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <style type="text/css">
        #loading{ width:100%;height:100%; background:#fff;position:fixed;z-index:999;left:0;right:0;}
        #loading img{width:100px; position:absolute; left:50%; margin-left:-50px; top:50%;}
    </style>

    <script type="text/javascript">
        window.onload=function(){
            var a = document.getElementById("loading");
            a.style.display="none";
        }
    </script>
    <style type="text/css">
        *{ margin:0;padding:0;}
        html,body{height: 100%;font-size:100%;}
        * html body{ overflow:visible;}
        * html iframe, * html frame{ overflow:auto;}
        * html frameset{ overflow:hidden;}

        body{ color:#000; background:#FFF;-webkit-text-size-adjust:none; font-family:"STHeiti-Medium",helvetica,"Microsoft YaHei",Verdana,Arial,sans-serif,"Times New Roman","宋体"; }
        body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,tr{ margin:0; padding:0;}
        input,select{ font-size:100%; vertical-align:middle; outline:none;}
        body div{ text-align:left;}
        textarea,input{ word-wrap:break-word; word-break:break-all; padding:0px;*font-size:100%;-webkit-appearance: none;}
        li{ list-style-type:none;}
        img{ border:0 none;}
        input[type="button"], input[type="submit"], input[type="reset"],select{-webkit-appearance: none;}
        input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {
            -webkit-appearance: none;
        }
        textarea {  -webkit-appearance: none;}
        a:link, a:visited{ color:#04C; text-decoration:none;}
        a:hover{ color:#F60;}
        h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}
        .clearfix:after {content:"."; display:block; height:0; visibility:hidden; clear:both; }
        .clearfix { *zoom:1; }
        .fl{ float:left;}
        .fr{ float:right;}

        .downBody{width: 100%; height: 100%; position: relative;}
        .partTop{width: 100%;height: 60%;background: url(images/download/bg.png) scroll no-repeat center top;background-size: 100% 100%;text-align: center;}
        .partTop img{height: 70%; padding-top: 4%;}
        .partBottom{padding-bottom: 20px;}
        .partBottom h5{font-size: 1.2rem;text-align: center;margin-top: 10px;}
        a.downBtn{display: block;border: 2px solid #ffa000;border-radius: 15px;width:70%;margin: 20px auto 0;height:3rem;line-height:3rem; text-align: center;color:#ffa000;font-size: 1.2rem;outline: none;}
        a.downBtn span{background: url(images/download/appico.png) scroll no-repeat 0 0;padding-left: 50px;height: 3rem;line-height: 3rem; display: inline-block;background-size: 28px auto;}
        a.ios span{background-position: 0 6px;}
        a.and span{background-position: 0 -67px;}


    </style>
</head>
<body>
<div id="loading">
    <img src="http://img.dfcbos.com/images/download/loading.gif">
</div>
<div class="downBody">
    <div class="partTop">
    </div>
    <div class="partBottom">
        <h5>HL客户端下载</h5>
        <a href="itms-services://?action=download-manifest&url=https://git.oschina.net/wade0595/HLStore-inhouse/raw/master/HL.plist" class="downBtn ios"><span>iPhone 版下载</span></a>
        <a href="https://git.oschina.net/wade0595/HLStore-inhouse/raw/master/HL_V1.0.apk" class="downBtn and"><span>Android 版下载</span></a>
    </div>
</div>
<div id="wx" style="width:100%; height:100%;background-color:rgba(0,0,0,0.6); position:fixed; left:0; top:0;text-align:right;display:none;">
    <img src="http://img.dfcbos.com/images/download/tc.png" style="width:80%; padding-right:10px;">
</div>
<script src="http://img.dfcbos.com/js/framework/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
    $(function(){


        var winW = window.innerWidth;
        var winH = window.innerHeight;
        var bWH = winW / winH;
//宽小于高的时候
        if(bWH<=0.67){
            // 获得新的高度
            var newH = winW / 0.67;
            //获取比例
            var biW = winW / 320;
            var biH = newH / 480;
            // 盒子居中
            var boxMiddle = (winH-newH)/2;
            $('.posBox').each(function(){
                $(this).css({'width':'100%','height':newH+'px','top':boxMiddle+'px'});
            });
            $('.resize1').each(function(){
                var reW = parseInt($(this).css('width')),
                        reH = parseInt($(this).css('height')),
                        reT = parseInt($(this).css('top')),
                        reB = parseInt($(this).css('bottom')),
                        reL = parseInt($(this).css('left')),
                        reR = parseInt($(this).css('right')),
                        reML = parseInt($(this).css('marginLeft')),
                        reMR = parseInt($(this).css('marginRight')),
                        reMT = parseInt($(this).css('marginTop')),
                        reMB = parseInt($(this).css('marginBottom'));

                $(this).css({
                    'height':reH*biH+'px',
                    'top':reT*biH+'px',
                    'bottom':reT*biH+'px',
                    'margin-left':reML*biW+'px',
                    'margin-right':reMR*biW+'px',
                    'margin-top':reMT*biH+'px',
                    'margin-bottom':reMB*biH+'px'
                });
            });

        }else{
            // 获得新的宽度
            var newW = winH * 0.67;
            //获取比例
            var biW2 = newW / 320;
            var biH2 = winH / 480;
            // 盒子居中
            var boxCenter = (winW-newW)/2;
            $('.posBox').each(function(){
                $(this).css({'height':'100%','width':newW+'px','left':boxCenter+'px'});
            });
            $('.resize1').each(function(){
                var reW = parseInt($(this).css('width')),
                        reH = parseInt($(this).css('height')),
                        reT = parseInt($(this).css('top')),
                        reB = parseInt($(this).css('bottom')),
                        reL = parseInt($(this).css('left')),
                        reR = parseInt($(this).css('right')),
                        reML = parseInt($(this).css('marginLeft')),
                        reMR = parseInt($(this).css('marginRight')),
                        reMT = parseInt($(this).css('marginTop')),
                        reMB = parseInt($(this).css('marginBottom'));

                $(this).css({
                    'height':reH*biH2+'px',
                    'top':reT*biH2+'px',
                    'bottom':reT*biH2+'px',
                    'margin-left':reML*biW2+'px',
                    'margin-right':reMR*biW2+'px',
                    'margin-top':reMT*biH2+'px',
                    'margin-bottom':reMB*biH2+'px'
                });
            });
        }
        $('.resize1 img').css('height','100%');
    });

    $(function(){

        if(isWeiXin()){
            $("#wx").show();
            $("#other").hide();
        }else{
            $("#wx").hide();
            $("#other").show();
        }

    });


    function isWeiXin(){
        var ua = window.navigator.userAgent.toLowerCase();
        if(ua.match(/MicroMessenger/i) == 'micromessenger'){
            return true;
        }else{
            return false;
        }
    }
</script>
</body>
</html>